<template>
  <div>
    <el-row
      v-for="(item, index) in formList"
      :key="'list' + index"
      :style="{ paddingLeft: titleLeft + 'px' }"
    >
      <el-row
        v-if="item.scoreClassList.length > 0 || item.fieldType != 'content'"
        style="margin-bottom: 20px; font-size: 15px"
      >
        {{ item.name }}
      </el-row>
      <row
        v-if="!item.fieldType || item.fieldType != 'content'"
        v-model="item.scoreClassList"
        :title-left="titleLeft"
        :disabled="disabled"
        @dataEmit="dataEmit"
      />
      <check
        v-if="!item.fieldType || item.fieldType != 'content'"
        v-model="item.data"
        :list="item.scoreClassList"
        style="padding-left: 40px"
        :disabled="disabled"
        @dataEmit="dataEmit"
      />
    </el-row>
  </div>
</template>

<script>
import Row from '@/components/scoreRow/Row'
import Check from '@/components/scoreRow/Check'
export default {
  name: 'Row',
  components: {
    Row,
    Check
  },
  model: {
    prop: 'list',
    event: 'listEmit'
  },
  props: {
    list: {
      type: Array,
      default: () => []
    },
    titleLeft: {
      type: String,
      default: '40'
    },
    disabled: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      formList: []
    }
  },
  watch: {
    formList: {
      handler(val) {
        this.$emit('listEmit', val)
      },
      deep: true
    }
  },
  mounted() {},
  created() {
    this.formList = this.list
  },
  methods: {
    dataEmit() {
      this.$emit('dataEmit')
    },
    emitData(data, index) {
      this.formList[index].data = data
    },
    getData(val) {
      console.log(val)
      return val
    }
  }
}
</script>

<style scoped>
</style>
